<template>
	<view class="">
		<!-- 遮罩层 -->
			<view v-show="menushow" @tap="closemenu" class="mask">
				
			</view>
			<view class="paper-list-menu " v-show="menushow">
				<block v-for="(item,index) in items">
				<view  @tap="click(index)" class=" paper-list-menu-list u-f-ac" hover-class="paper-list-menu-list-h">
					<u-icon class="paper-list-menu-text"  :name="item.icon" size="40"></u-icon> {{item.name}}
				</view>
				</block>
			<!-- 	<view @tap="tapclean" class="paper-list-menu-list u-f-ac" hover-class="paper-list-menu-list-h">
					<u-icon  class="paper-list-menu-text"   name="cut" size="40"></u-icon> 清除消息
				</view> -->
			</view>
	</view>
	
</template>

<script>
	export default {
		data() {
			return {
			
			}
		},
		props:{
			menushow:Boolean,
			items:Array
		},
		methods:{
			click(index){
				this.$emit('click',index)
			},
			//关闭遮罩层
			closemask(){
				this.$emit('closemask')
				
			},
			//点击清除
			tapclean(){
				this.$emit('tapclean')
			},
			tapadd(){
			this.$emit('tapadd')
			},
			//关闭菜单
			closemenu(){
				this.$emit("closemenu")
			},
			//打开
			openmenu(){
				this.$emit("openmenu")
				
			}
		}
	}
	
</script>

<style>
	.mask{
		position: fixed;
		
		top: 0upx;
		bottom: 0upx;
		left: 0upx;
		right: 0upx;
		z-index: 1999;
	}
	
	.paper-list-menu-list-h{
		background-color: #EEEEEE;
	}
	.paper-list-menu{
		position: absolute;
		right: 0upx;
		top: 10upx;
		background-color: #FFFFFF;
		border: #EEEEEE 1upx solid;
		width: 400upx;
		height: 200upx;
		z-index: 2000;
		box-shadow: 5px 6px 5px #EEEEEE;
	}
	.paper-list-menu-text{
		margin-right: 20upx;
	}
	.paper-list-menu-list{
		padding: 20upx;
	}
</style>
